<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('系统配置界面')" />
    <style>
        *{
            margin: 0px;
            padding: 0px;
        }
    </style>

</head>
<body>
<div class="panel panel-default">
    <div class="panel-heading">
        <h3 class="panel-title">系统配置列表</h3>
    </div>

    <div class="panel-body">
        <!--按钮-->
        <!--<button id="remove" class="btn btn-danger">删除</button>-->
        <!--表格内容-->
        <table id="table_operate"/>
    </div>
</div>
<!-- 全局js -->
<th:block th:include="include :: common-js" />
<script th:inline="javascript">
    var path = ctx + 'SystemConfigPage';
    $(function () {
        //1.初始化Table
        var oTable = new TableInit();
        oTable.Init();
    });

    //系统配置列表
    var TableInit = function () {
        var oTableInit = new Object();
        //初始化Table
        oTableInit.Init = function () {
            $('#table_operate').bootstrapTable({
                url: path + '/list',         //请求后台的URL（*）
                method: 'post',                     //请求方式（*）
                contentType:'application/x-www-form-urlencoded', // 编码类型
                toolbar: '#toolbar',                //工具按钮用哪个容器
                striped: true,                      //是否显示行间隔色
                cache: false,                       //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
                pagination: true,                  //是否显示分页（*）
                sortable: false,                    //是否启用排序
                sortOrder: "asc",                   //排序方式
                queryParams: function(params){
                    var temp = {
                        pageSize:params.limit,
                        pageNum:(params.offset / params.limit) + 1,
                    };
                    return temp;
                },//传递参数（*）
                sidePagination: "server",           //分页方式：client客户端分页，server服务端分页（*）
                pageNumber:1,                       //初始化加载第一页，默认第一页
                pageSize: 10,                       //每页的记录行数（*）
                pageList: [10, 20, 30, 40],        //可供选择的每页的行数（*）
                search: false,                      //是否显示表格搜索，此搜索是客户端搜索，不会进服务端，所以，个人感觉意义不大
                strictSearch: false,
                showColumns: false,                 //是否显示所有的列
                showRefresh: true,                 //是否显示刷新按钮
                minimumCountColumns: 2,             //最少允许的列数
                clickToSelect: true,                //是否启用点击选中行
                height: 522,                        //行高，如果没有设置height属性，表格自动根据记录条数觉得表格高度
                uniqueId: "ID",                     //每一行的唯一标识，一般为主键列
                showToggle:false,                   //是否显示详细视图和列表视图的切换按钮
                cardView: false,                    //是否显示详细视图
                detailView: false,                  //是否显示父子表
                columns: [{
                    field: 'optionId',
                    title: '主键',
                    visible: false
                },{
                    field:'bigBoundaryIpAddress',
                    title:'边界审计系统地址'
                },{
                    field:'bigBoundaryPort',
                    title:'边界审计系统端口'
                },{
                    field:'secretAddress',
                    title:'密标地址',
                    visible: isVisible()
                },{
                    field:'secretPort',
                    title:'密标端口',
                    visible: isVisible()
                },{
                    field:'isUploadLog',
                    title:'是否上传日志',
                    formatter: function(value, row, index) {
                        if(value==1){
                            return '开启';
                        }else if(value==0){
                            return '关闭';
                        }else{
                            return value;
                        }
                    }
                },{
                    field:'logType',
                    title:'日志类型',
                    formatter: function(value, row, index) {
                        if(value==1){
                            return '正向导出';
                        }else if(value==2){
                            return '反向导入';
                        }else{
                            return value;
                        }
                    }
                },
                {
                    field:'singleIp',
                    title:'单向导入系统业务IP'
                },
                {
                    field:'singleChannelPath',
                    title:'单向导入系统发送目录'
                },
                {
                    field:'fileSaveRoot',
                    title:'审批文件落地目录'
                },
                {
                    field:'illegalPath',
                    title:'非法文件目录'
                },

                {
                title: '操作',
                align: 'center',
                formatter: function(value, row, index) {
                    var actions = [];
                    actions.push('<a class="btn btn-danger btn-xs" href="#" onclick="updateOption('+row.optionId+')"><i class="fa fa-remove"></i>修改</a>');
                    return actions.join('');
                }
            }]
        });
        };

        return oTableInit;
    };

    //是否显示密标相关配置
    function isVisible(){

    }

    //更新系统配置
    function updateOption(id){
        let divWidth = 650;
        let divHeight = 700;
        layer.open({
            type: 2 //此处以iframe举例
            ,title: '修改系统配置'
            ,area: [divWidth+'px', divHeight+'px']
            ,shade: 0.3
            ,id:'div01'//设置一个id,防止重复弹出
            ,maxmin: true////不固定
            ,offset: [
                ($(window).height()/2)-(divHeight/2)-60
                ,($(window).width()/2)-(divWidth/2)
            ]
            ,content: '/SystemConfigPage/edit/'+id
            ,btn: ['确定', '取消']
            ,yes: function(index,layero){
                var iframeWin = layero.find('iframe')[0];
                iframeWin.contentWindow.submitForm(index, layero);
            }
            ,btn2: function(){
                layer.closeAll();
            }

            ,zIndex: layer.zIndex //重点1
            ,success: function(layero){
                layer.setTop(layero); //重点2
            }
        });
    }
</script>
</body>
</html>